<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true" >
			<block slot="backText" @tap="onreturn()">返回</block>
			<block slot="content">工单上传</block>
		</cu-custom>

		<scroll-view scroll-x class="bg-white nav text-center fixed" :style="[{top:CustomBar + 'px'}]">
			<view class="cu-item" :class="index==TabCur?'text-blue cur':''" v-for="(item,index) in devtypelist" :key="index"
			 @tap="tabSelect" :data-id="index">

				<block>
					<text :class="devtypelist[index].icon" type="default"></text>
					<text style="padding-left: 5px;" type="default">{{devtypelist[index].title}}</text>
				</block>

			</view>

		</scroll-view>
		<scroll-view scroll-y :style="[{top:CustomBar+150 + 'px'}]">
				<view class="cu-list menu-avatar" style="margin-top: 120upx;">
					<block v-if="TabCur==0">
						<view class="cu-item" style="height: 200upx;" v-for="(item,i) in uplist" :key="i">
						
								<view class="content" style="left: 30upx;">
								<!-- 	<view class="text-grey">{{item.cdate}}</view>
									<view class="text-grey">{{item.addr}}</view>
									<view class="text-gray text-sm">
										<text class="cuIcon-infofill text-red  margin-right-xs"></text>
										【编号:{{item.orderno}}】{{item.content}}
									</view>
									<view>
										<text class="text-grey" style="padding-left:8px;">维修结果:</text>
										<text class="cu-tag round bg-green cuIcon-check" type="default"></text>
										<text class="text-grey" style="padding-left:8px;">已修好</text>
									</view> -->
									<template>
										<view>
											<view class="text-grey">[户主-{{item.name}}]&emsp;{{item.addr}}</view>
										</view>
										<view>
											<icon class="cuIcon-infofill text-red "></icon>【故障描述】{{item.content.substr(0, 20)}}
											<text v-if="item.content !== null && item.content.length > 20">
												...
											</text>
											<text v-if="item.content !== null && item.content.length > 20" class="full_text line-pink text-bold"
											 @click="toggleDescription(item.content)">查看全文</text>
									
										</view>
										<view>
											<text class="text-grey" style="padding-left:8px;">维修结果:</text>
											<text class="cu-tag round bg-green cuIcon-check" type="default"></text>
											<text class="text-grey" style="padding-left:8px;">已修好</text>
										</view>
									</template>
						
								</view>
								<view class="action">
									<!-- <view class="text-grey text-sm">2019-12-12 12:00</view> -->
									<view class="cu-tag round sm" :class="item.state==0?'bg-red':'bg-green'" >{{item.state==0?'待上传':'已上传'}}</view>
								</view>
						
							</view>
						
					</block>
					<block v-if="TabCur==1">
						<view class="cu-item" style="height: 200upx;" v-for="(item,i) in uplist2" :key="i">
						
								<view class="content" style="left: 30upx;">
									 <template>
									 	<view>
									 		<view class="text-grey">[户主-{{item.name}}]&emsp;{{item.addr}}</view>
									 	</view>
									 	<view>
									 		<icon class="cuIcon-infofill text-red "></icon>【故障描述】{{item.content.substr(0, 20)}}
									 		<text v-if="item.content !== null && item.content.length > 20">
									 			...
									 		</text>
									 		<text v-if="item.content !== null && item.content.length > 20" class="full_text line-pink text-bold"
									 		 @click="toggleDescription(item.content)">查看全文</text>
									 
									 	</view>
									 	<view>
									 		<text class="text-grey" style="padding-left:8px;">维修结果:</text>
									 		<text class="cu-tag round bg-green cuIcon-check" type="default"></text>
									 		<text class="text-grey" style="padding-left:8px;">已修好</text>
									 	</view>
									 </template>
								</view>
								<view class="action">
									<!-- <view class="text-grey text-sm">2019-12-12 12:00</view> -->
									<view class="cu-tag round sm" :class="item.state==0?'bg-red':'bg-green'" >{{item.state==0?'待上传':'已上传'}}</view>
								</view>
						
							</view>
						
					</block>
					</view>
		 
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				CustomBar: this.CustomBar,
				TabCur: 0,
				username:'',
				uplist: [],
				uplist2:[],
				devtypelist: [{
						title: '待上传',
						icon: 'cuIcon-loading'
					},
					{
						title: '已上传',
						icon: 'cuIcon-roundcheck'
					},
				],
				
			}
		},
		onBackPress(options) {
			// Android 实体返回键 (from = backbutton)
			// 顶部导航栏左边的返回按钮 (from = backbutton)
			// 返回 API，即 uni.navigateBack() (from = navigateBack)
		
			if (options.from === 'navigateBack') {
				return false;
			}
			this.backButton();
			return true;
		
		}
		,onReady() { 
			this.getorderlist();
		},
		 onLoad(event) {
		 	this.pid = event.pid; 
		 	console.log('当前选项卡' + this.pid); 
		 	this.TabCur = this.pid;  
			
			uni.getStorage({
				key: 'userInfo',
				success: (res) => {
					console.log(res.data.name+"aaaaaaaaaaa");
					this.username = res.data.name;
					
				},
				fail: (e) => {
					//this.toLogin(); 
				}
			});   
			
		 },
		methods: {
			// 全文展开收起
			toggleDescription(num) {
				//this.showText = !this.showText;
				uni.showModal({
					content: num
				})
			}, 
			// 返回上一页
			onreturn() {
				uni.reLaunch({
					url: '../index/index'
				});
			},
			backButton() {
				uni.navigateBack({
					delta: 1
				});
			},
			toPage(url) {
				if (!url) {
					uni.showToast({
						title: '模板未包含此页面',
						icon: "none"
					});
					return;
				}
				uni.navigateTo({
					url: url
				})
			},
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
			},
			getorderlist() {
				var _self = this;
				var sqlwhere = " and wx_people='"+_self.username+"'";
			   console.log("查询条件" + sqlwhere);
				plus.sqlite.selectSql({
					name: 'test',
					sql: 'select * from c_wordorder_record  where state=2'+sqlwhere+' order by cdate asc',
					success: (data) => {
						_self.uplist = data;
						 
					},
					fail: function(e) {
						console.log('selectSql failed: ' + JSON.stringify(e));
					}
				});
				plus.sqlite.selectSql({
					name: 'test',
					sql: 'select * from c_wordorder_record  where state=3'+sqlwhere+' order by cdate asc',
					success: (data) => {
						_self.uplist2 = data; 
					},
					fail: function(e) {
						console.log('selectSql failed: ' + JSON.stringify(e));
					}
				});
			}
		}
	}
</script>

<style>

</style>
